<div class="container shadow p-3 row" id="Tz_box" xmlns:th="http://www.thymeleaf.org">
    <h2 class="text-center">自定义头像</h2>
    <div class="col-md-1"></div>
    <div class="col-md-5">
        <input type="file" id="input" size="10" style="visibility:hidden;"/>
        <canvas id="Tz_wrap" class="shadow"></canvas>
        <p class="text-center">请拖拽图片至此区域</p>
    </div>
    <div class="col-md-5 align-self-end text-center">

        <div>
            <canvas id="plugin-imgUpload-final-img" class="preview shadow"></canvas>
            <p class="tit">图片预览:200*200</p>
            <div class="prev"><img src="" id="imgg"></div>
        </div>

    </div>
    <nav class="text-center mb-5">
        <div class="btn btn-primary mx-3" id="upload">⇧<span>上传图片</span></div>
        <div class="btn btn-primary mx-3" id="rotateLeftBtn">↶<span>左旋转</span></div>
        <div class="btn btn-primary mx-3"  id="rotateRightBtn">↷<span>左旋转</span></div>
    </nav>
    <nav class="text-center mb-3">
        <a class="btn btn-secondary w-25 me-3" href="/user-center.html?type=head">返回</a>
        <button id="imgUpload_save" class="btn btn-success w-25 ms-3" onclick="saveUserHeadBySelf('imgUpload_save')">保存</button>
    </nav>
    <div class="col-md-1"></div>
</div>
